<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="../css/goods/confirm_order.css" />
		<link rel="stylesheet" href="../css/mui.picker.min.css">
		<script type="text/javascript">
			(function() {
				var clientWidth = document.documentElement ? document.documentElement.clientWidth : document.body.clientWidth;
				clientWidth = clientWidth || localStorage.getItem("clientWidth")
				if(clientWidth > 750)
					clientWidth = 750;
				document.documentElement.style.fontSize = clientWidth * 1 / 16 + "px";
			})();
		</script>
		<style type="text/css">
			.mui-bar-nav {
				top: 0;
			}
			
			.mui-content {
				padding-bottom: 100px;
				padding-top: 44px !important;
			}
			
			html,
			body {
				padding-top: 0;
			}
			
			.select_add_acitydiv {
				width: 100%;
				height: 2rem;
			}
			
			.select_add_acity {
				width: 100%;
				height: 2rem;
				position: absolute;
				left: 0;
				bottom: 0px;
				text-align: center;
				line-height: 2rem;
				font-size: 18px;
				background: #F8F8F8;
			}
		</style>
	</head>

	<body>

		<div id="app">
			<header class="mui-bar mui-bar-nav" style="border-bottom: 1px solid #c5c5c5">
				<a class="mui-action-back mui-icon  mui-pull-left arr_left">
				</a>
				<h1 class="mui-title">确认订单</h1>
				<!-- <a class="mui-pull-right" onclick = "buy_car.is_show_del(this)">管理</a> -->
			</header>
			<div class="mui-content">
				<div class="address">

					<div class="send_type">
						<span>选择配送方式：</span>

						<span :class="i==now_send_index?'btn bg_blue':'btn'" v-for="(t,i) in send_types" v-html="t" @click="sel_send_type(i)"></span>

					</div>
					<div @click="address_list" style="font-size: 0.6rem;line-height: 2rem;height: 2rem;" v-show="!default_address">请先添加收货地址</div>
					<div class="address_info" @click="open_select_address_box " v-show="default_address">

						<div class="title" :data-id="default_address.uaid">
							<span class="name">{{default_address.name}} : </span>{{default_address.phone}}
						</div>
						<div class="info">
							<i></i>
							<span>{{default_address.province}}{{default_address.city}}{{default_address.area}}{{default_address.address}}</span>
							<b></b>
						</div>

					</div>
				</div>

				<div class="order_info">
					<div class="title">社区商城</div>
					<div class="goods_list" v-if="confirmType == 0">
						<div class="goods_item" v-for="goodsItem in  goodsGroup">
							<div class="img">
								<img :src="goodsItem.pic" alt="">
							</div>
							<div class="info">
								<div class="goods_title">{{goodsItem.name}}</div>
								<div class="canshu">
									<span class="fl">规格：{{goodsItem.rule}}</span>
									<span class="fr">×{{goodsItem.num}}</span>
								</div>
								<span class="price">￥{{goodsItem.price}}</span>
							</div>
						</div>
					</div>

					<div class="goods_list" v-if="confirmType == 1">
						<div class="goods_item">
							<div class="img">
								<img :src="wareItem.pic" alt="">
							</div>
							<div class="info">
								<div class="goods_title">{{wareItem.name}}</div>
								<div class="canshu">
									<span class="fl">规格：{{specification.rule}}</span>
									<span class="fr">×{{cartInfo.num}}</span>
								</div>
								<span class="price">￥{{buy_way=='group'?specification.spell_money:specification.price}}</span>
							</div>
						</div>
					</div>

					<div class="order_msg">
						<div>
							<span class="title">可用优惠</span>
							<span class="right" @click="select_youhui">{{currentCoupon ? currentCoupon.text : '优惠券'}}
                        <i class="mui-icon mui-icon-arrowdown"></i>
                    </span>
						</div>
					</div>

					<div class="order_msg">
						<div>
							<span class="title">买家留言</span>
							<input type="text" v-model="remark" placeholder="选填" style="margin-left: 10px;">
						</div>
					</div>
					<div class="order_msg">
						<div class="bottom_info">
							<span class="title">共{{goods_num}}件商品</span>
							<span class="right">合计:
                        <span class="price">￥{{balance}}</span>
							</span>
						</div>
					</div>
					<div class="submit_order" @click="formSubmit()">
						<button class="">提交订单</button>
					</div>

					<transition name="slide-fade">

						<div class="msg_box" v-if="show_address_box">

							<div class="top_title">确认收获地址</div>
							<div class="infos">
								<div class="ads" @click="to_page('跳转选择地址页')">
									<span class="name">地址：</span>
									<span class="text"> 陕西省西安市未央区经开区凤城八路与 文景路十字风景御园19栋</span>
									<i class="fr mui-icon mui-icon-arrowright" style="color: #212121;"></i>
								</div>
								<div class="ads pays" @click="select_pay_type">
									<span class="pay fl">支付方式：</span>

									<i class="fr mui-icon mui-icon-arrowright" style="color: #212121;"></i>
									<span class="pay_type fr">微信支付</span>
								</div>
							</div>
							<div class="submit_order to_pay" @click="to_page('跳转支付页面')">
								<button class="">立即付款</button>
							</div>
						</div>

					</transition>

					<transition name="slide-fade">

						<!--选择地址-->
						<div class="select_address" v-show="show_address_select_box">
							<div class="select_address_item" @click="select_address(i.uaid,k)" v-for="(i,k) in address_lists">
								<div class="selected_incon" v-if="k==select_address_index"><img src="../images/car_07.png" alt=""></div>
								<div class="select_address_item_info">
									<div>{{i.name}} {{i.phone}} <span :class="i.default==1?'is_default':'' ">默认</span></div>
									<div>{{i.province}}{{i.city}}{{i.area}} {{i.address}}</div>
								</div>
							</div>
							<div class="select_add_acitydiv"></div>
							<div class="select_add_acity" @click="address_list">
								添加地址
							</div>
						</div>

					</transition>
					<div class="back_box" @click="show_address_select_box=false" v-show="show_address_select_box"></div>
				</div>
			</div>

			<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
			<script src="../js/tools/util.js"></script>

			<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
			<script src="../js/vue.min.js"></script>
			<script src="../js/mui.picker.min.js"></script>

			<script src="../js/host.config.js"></script>

			<script src="../js/tools/pay.js" type="text/javascript" charset="utf-8"></script>

			<script src="../js/js.js" type="text/javascript" charset="utf-8"></script>
			<script>
				var submit_mask;
				var pay_type_picker;
				var youhui_picker;
				var confirm_order = new Vue({
					el: '#app',
					data: {
						select_address_index: '', //选中的地址下标
						show_address_select_box: false,
						address_lists: '', //用户所有地址的列表
						default_address: '', //用户所有地址的列表
						send_types: ['配送上门'],
						now_send_index: 0,
						show_address_box: false,
						goodsGroup: [], // 商品数据
						couponGroup: [{
							price: 5
						}],
						currentCoupon: null, //优惠券
						balance: 0, //总价
						confirmType: 0, // 类型
						cartInfo: {}, // 购物车信息
						remark: '', // 备注
						sendType: '货到支付',
						wareItem: {}, // 商品
						user: '', //用户信息
						specification: '', //快速下单时 单个商品的规格价钱等信息
						goods_num: '', //商品总数
						buy_way: "",
						spell_money: '',
						sq_info:'',//社区信息
					},
					methods: {
						address_list: function() {
							mui.openWindow({
								url: 'my_newads_confirm_order.html',
								id: 'my_newads_confirm_order.html',
								createNew: true
							})
						},

						open_select_address_box: function() {
							this.show_address_select_box = true;
						},
						sel_send_type: function(i) {
							this.now_send_index = i;
							this.sendType = this.send_types[i];
							console.log(this.sendType);
						},
						to_submit: function() {

							submit_mask.show();
							this.show_address_box = true;
						},
						to_page: function(page) {
							mui.toast(page)
						},
						select_pay_type: function() {
							pay_type_picker.show(function(selectItems) {
								mui.toast("选择了" + selectItems[0].text);
							})
						},
						select_youhui: function() {
							var _this = this;

							youhui_picker.show(function(selectItems) {

								if(_this.balance < selectItems[0].full_money) {
									mui.toast("不符合使用金额");
									return false;
								}
								_this.currentCoupon = selectItems[0];

								if(selectItems[0].disid == -1) {
									return
								}
								_this.balance = parseFloat(_this.balance) - parseFloat(selectItems[0].money)

							})
						},
						go_address_list: function() {
							mui.openWindow('address_list.html', 'address_list.html')
						},
						select_address: function(address_id, index) {
							console.log(address_id)
							console.log(index);
							this.default_address = this.address_lists[index];
							this.show_address_select_box = false;
							this.select_address_index = index

						},
						countPrice: function() { // 价格统计

							/*
                    var confirmType = this.confirmType;
                    var goodsGroup = this.goodsGroup;
                    var wareItem = this.wareItem;
                    var cartInfo = this.cartInfo;
                    var count = 0;
                    if(confirmType == 0){
                        goodsGroup.forEach(function (item, index) {
                        	 
                            count += (item.num * (item.min_price*100) )/100;
                        });
                    }else if(confirmType == 1){
                        count = (wareItem.min_price*100) * cartInfo.num;
                        count = count/100;
                    }
                    //this.balance = count;
                    if (this.currentCoupon) {
                        this.balance -= this.currentCoupon.money;
                        if (this.balance <= 0) {
                            //this.balance = 0;
                        }
                    }
                    */
						},
						formSubmit: function() { // 提交订单,

							if(this.address_lists.length == 0) {
								mui.alert("请先添加收货地址");
								return
							}
							if(host_config.localStorage.cartInfo) {
								var attr = JSON.parse(host_config.localStorage.cartInfo);
							}

							if(this.confirmType == 0) { // 购物车下单
								var cart_data = {
									cartid: this.cartInfo.cartids,
									distribution_pay: this.sendType,
									redbao: this.currentCoupon ? this.currentCoupon.disid : 0,
									order_remark: this.remark
								};

								$.post(url + 'app/order/appinsertOrder', {
									cart_data: cart_data,
									uid: this.user.uid,
									type: 1
								}, function(response) {
									var responseData = JSON.parse(response);
									if(responseData.code == '1') {
										util.log("购物车下单下单成功 去支付" + JSON.stringify(responseData))
										pay_fun(responseData.order_no)
										//										mui.openWindow('order_list.html?status=1', 'order_list.html?status=1');
									}
								});

							} else if(this.confirmType == 1) { // 快速下单

								var cartInfo = this.cartInfo;

								var groupBuying = cartInfo.groupBuying;

								if(groupBuying) { // 拼团订单
									var goodsid = cartInfo.goodsid;
									var num = cartInfo.num;
									var remark = this.remark;
									var attrid = cartInfo.attrid;
									var spell = cartInfo.spell;
									var spell_id = cartInfo.spell_id;
									var redbao = this.currentCoupon ? this.currentCoupon.disid : 0;
									var sid = '';
									if(util.GetQueryString('sid')) {
										sid = util.GetQueryString('sid');
									}
									util.log("快速下单 拼团订单 ");
					 
									$.post(url + 'app/goods/SpellInsert', {
										goodsid: goodsid,
										num: num,
										remark: remark,
										attrid: attrid,
										redbao: redbao,
										spell: 1,
										spell_id: spell_id,
										uid: this.user.uid,
										sid: sid,
										attrid: attr.attrid
									}, function(response) {
										var responseData = JSON.parse(response);
										if(responseData.code == '1') {
											console.log('下单成功 去支付');
											util.log("拼团订单 下单成功 去支付" + JSON.stringify(responseData));

											pay_fun(responseData.order_no,'group')
											//											mui.openWindow('group_order_list.html?status=1', 'group_order_list.html?status=1');
										} else {
											mui.toast(responseData.msg);
										}
									});
								} else { // 快速下单
									util.log("快速下单")
									var goods_data = {
										goodsid: cartInfo.goodsid,
										number: cartInfo.num,
										remark: this.remark,
										rule: cartInfo.rule,
										redbao: this.currentCoupon ? this.currentCoupon.disid : 0,
										attrid: attr.attrid
									};
									util.log(JSON.stringify(goods_data));
									util.log(url + 'api/order/appinsertOrder');
									console.log(111)
									
									$.ajax({
										type: 'post',
										url: url + 'api/order/appinsertOrder',
										data: {
											goods_data: JSON.stringify(goods_data),
											uid: this.user.uid
										},
										success: function(response) {
											console.log(222)
											console.log(response)
											var responseData = JSON.parse(response);
											if(responseData.code == '1' && responseData.data) {

												util.log("快速下单-- 下单成功 去支付" + JSON.stringify(responseData))

												util.log(JSON.stringify(responseData));

												pay_fun(responseData.data.order_no)

											}else{
												mui.toast("下单失败")
											}
										},
										error: function(err) {
											console.log(333)
											alert("服务器错误")
											alert(JSON.stringify(err))
										}
									})

									/*
									$.post(url + 'api/order/appinsertOrder', {
										goods_data: goods_data,
										uid: this.user.uid
									}, function(response) {
										var responseData = JSON.parse(response);
										if(responseData.code == '1' && responseData.data) {

											util.log("快速下单-- 下单成功 去支付"+JSON.stringify(responseData))
											
											util.log(JSON.stringify(responseData));
					 
											pay_fun(responseData.data.order_no)
										 
											
										}
									});
									*/
								}
							}
						}
					},
					mounted: function() {

						var _this = this;
						var user = host_config.localStorage.user;
						if(user) {
							this.user = JSON.parse(user);
						}
						var address = localStorage.getItem("address");
						if(address){
							address = JSON.parse(address)
						}
						this.sq_info = address;
						//获取地址列表
						$.ajax({
							url: host_config.app_server + "address/addressList",
							type: 'get',
							data: {
								uid: _this.user.uid,
							},
							success: function(res) {

								res = JSON.parse(res)
								console.log(JSON.stringify(res), 'data')
								_this.address_lists = res.data;
								for(var i = 0; i < res.data.length; i++) {
									if(res.data[i].default == 1) {
										_this.default_address = res.data[i];
										_this.select_address_index = i;
									}
								}
							},
							error: function(err) {
								console.log(err)
							}
						})
						var confirmType = util.GetQueryString('confirmType');
						var cartInfo = JSON.parse(host_config.localStorage.cartInfo);
						this.confirmType = confirmType;
						this.cartInfo = cartInfo; //规格

						console.log("cartInfo", cartInfo);

						if(confirmType == 0) { // 购物车下单
							console.log("confirmType == 0 购物车下单")
							var data = cartInfo.cartids;
							var datalist = '';
							for(var i = 0; i < data.length; i++) {
								datalist = datalist += data[i] + ','
							}

							$.post(url + 'api/cart/cartList', {
								uid: this.user.uid,
								cartid: datalist
							}, function(response) {

								var responseData = JSON.parse(response);
								console.log(responseData, 'responseData')

								if(responseData.code == '1') {
									var goods = responseData.data;
									var tempGroup = [];
									var zongjia = 0;
									var zongshu = 0;
									mui.each(goods, function(key, value) {
										tempGroup.push(value)
										zongjia += (value.price * 100) * value.num;
										zongshu += parseInt(value.num)
										//console.log(value)
									})
									confirm_order.balance = zongjia / 100;
									confirm_order.goods_num = zongshu;

									console.log(confirm_order.balance)
									_this.goodsGroup = tempGroup;
								}
							})
						} else if(confirmType == 1) { // 快速下单
							// 只有一个商品  yb
							var way = util.GetQueryString("way");
							console.log("--------------------")
							console.log(way);
							this.buy_way = way

							console.log("confirmType == 1  快速下单 2222222222")
							var sid = util.GetQueryString("sid");
							// 获取商品信息
							this.goods_num = this.cartInfo.num;
							$.get(url + 'app/goods/detail', {
								goodsid: cartInfo.goodsid,
								sid:sid
							}, function(response) {
								var responseData = JSON.parse(response);

								if(responseData.code == '1') {
									var goods = responseData.data;
									console.log("goods", goods)
									var zongjia = 0;
									console.log("单价" + goods.min_price)
									console.log("数量" + confirm_order.cartInfo.num)
									zongjia = goods.min_price * confirm_order.cartInfo.num
									confirm_order.balance = zongjia.toFixed(2);
									console.log("总价" + confirm_order.balance)
									var wareItem = responseData.data;
									_this.wareItem = wareItem;

									for(var i = 0; i < _this.wareItem.specification.length; i++) {
										if(_this.wareItem.specification[i].attrid == _this.cartInfo.attrid) {
											_this.specification = _this.wareItem.specification[i]

											break;

										}

									}
									console.log("当前规格", _this.specification.rule)
									//重新计算规格价钱

									if(way == "group") {
										_this.balance = 	parseFloat(_this.specification.spell_money) * 100 * parseInt(_this.goods_num) / 100;
										_this.spell_money = responseData.data.spell_money;

									} else {
										_this.balance = parseFloat(_this.specification.price) * 100 * parseInt(_this.goods_num) / 100;
									}

									console.log("重新计算规格价钱" + _this.balance)

								}

							});
						}
						// var sq_info = JSON.parse(localStorage.getItem("address"));

						// 获取我的优惠券
						$.get("https://zhapp.4hl.cn/app/Coupon/usercoupon", {
							uid: this.user.uid,
							youtype: 2,

						}, function(response) {
							var responseData = JSON.parse(response).data;

							responseData.forEach(function(item, index) {
								console.log(item)
								item.text = item.couponconter;
							})
							console.log(responseData);

							_this.couponGroup = responseData;
							youhui_picker = new mui.PopPicker();
							youhui_picker.setData(responseData);
						});

						mui.init();
						submit_mask = mui.createMask(function() {
							that.show_address_box = false;
						});

					}
				})
			</script>
	</body>

</html>